<template>
  <a-modal @cancel="close" title="工单操作引导图" width="85vw" v-model:visible="visible">
    <div>
      <img class="icon-img" src="../../../../../assets/workordertip.png" />
    </div>
    <template #footer>
      <a-button @click="close">关闭</a-button>
      <a-button type="primary" @click="handleBeforeOk">下次不再提醒</a-button>
    </template>
  </a-modal>
</template>

<script setup name="imgTipModal">
  import dayjs from 'dayjs'
  import { ref } from 'vue'
  // emit 事件
  const emit = defineEmits(['closeTip'])
  const visible = ref(false)
  const open = () => {
    visible.value = true
  }
  const format = (dayjsObj) => {
    return dayjsObj.format('YYYY-MM-DD')
  }
  // 关闭
  const close = () => {
    visible.value = false
    localStorage.setItem('workOrderImgTipFirstDate', format(dayjs().startOf('d')))
  }
  const handleBeforeOk = () => {
    emit('closeTip')
    visible.value = false
  }
  defineExpose({
    open,
  })
</script>
<style lang="less" scoped>
  :deep(.arco-row) {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  :deep(.arco-modal-body) {
    padding: 10px 80px !important;
  }
  :deep(.arco-col) {
    padding: 0 10px !important;
  }
</style>
